<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="main-header">
    <div class="logo-header">
        <a href="/" class="logo">
            www.runoop.cn 编程网
        </a>
        <button class="navbar-toggler sidenav-toggler ml-auto" type="button" data-toggle="collapse"
                data-target="collapse" aria-controls="sidebar" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <button class="topbar-toggler more"><i class="la la-ellipsis-v"></i></button>
    </div>
    <nav class="navbar navbar-header navbar-expand-lg">
        <div class="container-fluid">

            <form class="navbar-left navbar-form nav-search mr-md-3" action="">
                <div class="input-group">
                    <input type="text" placeholder="搜索 ..." class="form-control">
                    <div class="input-group-append">
								<span class="input-group-text">
									<i class="la la-search search-icon"></i>
								</span>
                    </div>
                </div>
            </form>
            <ul class="navbar-nav topbar-nav ml-md-auto align-items-center">
                <li class="nav-item hidden-caret">
                    <a class="nav-link dropdown-toggle" href="/" role="button" aria-haspopup="true"
                       aria-expanded="false">
                        <i class="la la-institution"></i>
                    </a>
                </li>
                <li class="nav-item dropdown hidden-caret">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button"
                       data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <i class="la la-book"></i>
                        <span class="notification">3</span>
                    </a>
                    <ul class="dropdown-menu notif-box" aria-labelledby="navbarDropdown">
                        <li>
                            <div class="dropdown-title">更上一层楼</div>
                        </li>
                        <li>
                            <div class="notif-center">
                                <a href="/article/new">
                                    <div class="notif-icon notif-primary"><i class="la la-user-plus"></i></div>
                                    <div class="notif-content">
												<span class="block">
													最新教程
												</span>
                                        <span class="time">与时俱变，接地气</span>
                                    </div>
                                </a>
                                <a href="#">
                                    <div class="notif-icon notif-success"><i class="la la-comment"></i></div>
                                    <div class="notif-content">
												<span class="block">
													视频教程
												</span>
                                        <span class="time">视频详细讲解每个知识点</span>
                                    </div>
                                </a>
                                <a href="#">
                                    <div class="notif-icon notif-danger"><i class="la la-heart"></i></div>
                                    <div class="notif-content">
												<span class="block">
													实战项目
												</span>
                                        <span class="time">最真实的开发体验与经验</span>
                                    </div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a class="see-all" href="javascript:void(0);"> <strong>开发心得与体会</strong> <i class="la la-angle-right"></i> </a>
                        </li>
                    </ul>
                </li>
                <li class="nav-item dropdown hidden-caret">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                       data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <i class="la la-comments"></i>
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a class="dropdown-item" href="/share">加入QQ群</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="/about">关于</a>
                    </div>
                </li>
                <c:choose>
                    <c:when test="${empty currentUser}">
                        <li class="nav-item hidden-caret">
                            <a class="nav-link dropdown-toggle" href="/login" role="button" aria-haspopup="true"
                               aria-expanded="false">
                                <i class="la la-user"></i>
                            </a>
                        </li>
                        <li class="nav-item hidden-caret">
                            <a class="nav-link dropdown-toggle" href="/register" role="button" aria-haspopup="true"
                               aria-expanded="false">
                                <i class="la la-user-plus"></i>
                            </a>
                        </li>
                    </c:when>
                    <c:when test="${!empty currentUser}">
                        <shiro:hasRole name="user">
                            <li class="nav-item dropdown">
                                <a class="dropdown-toggle profile-pic" data-toggle="dropdown" href="#"
                                   aria-expanded="false">
                                    <img src="/resources/assets/img/profile.jpg" alt="user-img" width="36"
                                         class="img-circle"><span>${currentUser.userName}</span></span> </a>
                                <ul class="dropdown-menu dropdown-user">
                                    <li>
                                        <div class="user-box">
                                            <div class="u-img"><img src="/resources/assets/img/profile.jpg" alt="user">
                                            </div>
                                            <div class="u-text">
                                                <h4>${currentUser.userName}</h4>
                                                <p class="text-muted">${currentUser.userEmail}</p>
                                                <a href="/user/info" class="btn btn-rounded btn-primary btn-sm">个人首页</a>
                                            </div>
                                        </div>
                                    </li>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="/user/info"><i class="ti-email"></i> 基本信息</a>
                                    <a class="dropdown-item" href="/user/password"><i class="ti-email"></i> 修改密码</a>
                                    <a class="dropdown-item" href="/user/order"><i class="ti-user"></i> 订单记录</a>
                                    <%--<div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="/user/settings"><i class="ti-settings"></i> 账号设置</a>--%>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="/logout"><i class="fa fa-power-off"></i> 退出</a>
                                </ul>
                                <!-- /.dropdown-user -->
                            </li>
                        </shiro:hasRole>
                        <shiro:hasRole name="admin">
                            <li class="nav-item hidden-caret">
                                <a class="nav-link dropdown-toggle" href="/login" role="button" aria-haspopup="true"
                                   aria-expanded="false">
                                    <i class="la la-user"></i>
                                </a>
                            </li>
                            <li class="nav-item hidden-caret">
                                <a class="nav-link dropdown-toggle" href="/register" role="button" aria-haspopup="true"
                                   aria-expanded="false">
                                    <i class="la la-user-plus"></i>
                                </a>
                            </li>
                        </shiro:hasRole>
                    </c:when>
                </c:choose>
            </ul>
        </div>
    </nav>
</div>
